<template>
	<view class="content">
		<view class="inputLay">
			<view class="title">
				扭蛋馆名称
			</view>

			<uni-easyinput :styles="styles" :placeholderStyle="placeholderStyle" primaryColor="#FF9BA7"
				placeholder="请输入扭蛋馆名称" trim="all" v-model="value1">

			</uni-easyinput>
			<view class="title">
				QQ联系方式
			</view>
			<uni-easyinput :styles="styles" :placeholderStyle="placeholderStyle" primaryColor="#FF9BA7" class="asdasd"
				placeholder="请输入联系方式" trim="all" v-model="value">
			</uni-easyinput>
			<view class="title">
				TB千牛截图
			</view>
			<!-- v-model="license_image" -->
			<uni-file-picker limit=1 :image-styles="imageStyles" 
			fileMediatype="image" mode="grid"
				@select="select" @progress="progress" @success="success" @fail="fail" />
		</view>
		<view class="buttonLay">
			<view class="butStyle butAction" @click="verifyFn">
				提交
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				placeholderStyle: "color:#B6B6B6;font-size:12px",

				styles: {
					backgroundColor: " #F2F2F2",
					color: '#343434',
					borderColor: '#F2F2F2'
				},
				value1: '',
				value: '',
				license_image: [],
				listStyles: {
					"borderStyle": {
						"color": "#eee", // 边框颜色
						"width": "1px", // 边框宽度
						"style": "solid", // 边框样式
						"radius": "5px" // 边框圆角，不支持百分比
					},
					"border": false, // 是否显示边框
					"dividline": true // 是否显示分隔线
				},
				imageStyles: {
					"height": 120, // 边框高度
					"width": 120, // 边框宽度
					"border": { // 如果为 Boolean 值，可以控制边框显示与否
						"color": "#EFEFEF", // 边框颜色
						"width": "1px", // 边框宽度
						"style": "solid", // 边框样式
						"radius": "10", // 边框圆角，支持百分比
					}
				},
			}
		},
		onLoad() {

		},
		async onShow() {
			await this.$onLaunched
		},
		// onShareAppMessage(res) {
		// 	return {
		// 		title: "给你分享了一份宝藏，快进来看看～",
		// 		path: '/pages/index/index',
		// 		imageUrl: '../../static/share.png'
		// 	};
		// },
		methods: {
			// 获取上传状态
			select(e) {
				let that = this;
				console.log('选择文件：', e);
				that.$uploadImage(e.tempFilePaths[0]).then(res1 => {
					console.log(res1, "图片的");
					let res2=JSON.parse(res1);
					debugger
					if (res2.code == 0) {
						that.license_image = that.$options.filters.completeUrl(res2.data.path);
					console.log(that.license_image , "图片的");
					} else {
						that.$showToast(res2.msg);
					}
				
				});
			},
			
			verifyFn() {
				let that = this;
				if (that.value1.trim().length == 0) {
					that.$showToast('请输入扭蛋馆名称');
					that.value1 = ''
					return false;
				}
				if (that.value.trim().length == 0) {
					that.$showToast('请输入联系方式');
					return false;
				}
				if (that.license_image.length == 0) {
					that.$showToast('请上传TB千牛截图');
					return false;
				}
				that.merchantFn();
			},
			// 验证绑定
			merchantFn() {
				this.$http('/v1/applications/merchant', {
					"merchant_name":this.value1, 
					"qq_number": this.value, 
					// "logo_image": "http://example.com/images/logo.png", 
					"license_image": this.license_image, 
				}, 'POST').then(res => {
					console.log(res);
					if (res.code == 0) {
						this.getOpenerEventChannel().emit('refreshData')
						setTimeout(() => uni.navigateBack(), 500)
					} else {
					}
					this.$showToast(res.msg)
				})
			},
			// 获取上传进度
			progress(e) {
				console.log('上传进度：', e)
			},

			// 上传成功
			success(e) {
				console.log('上传成功')
			},

			// 上传失败
			fail(e) {
				console.log('上传失败：', e)
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 622upx;
		margin: 0 auto;
		font-family: PingFangSC, PingFang SC;
	}



	::v-deep .inputLay {
		margin-top: 20upx;

		.title {
			font-family: PingFangSC, PingFang SC;
			font-weight: 600;
			font-size: 34rpx;
			color: #454545;
			line-height: 48rpx;
			letter-spacing: 1px;
			margin-top: 62upx;
			margin-bottom: 20upx;
		}

		.uni-easyinput {
			.is-input-border {
				border-radius: 34upx;

				// height: 70upx;
				.uni-easyinput__content-input {
					padding-left: 30px;

				}
			}
		}
	}

	.rightLay {
		font-weight: 300;
		font-size: 23upx;
		color: #343434;
		line-height: 32upx;
		margin-right: 30upx;
	}

	.asdasd {
		padding-top: 30px !important;
	}

	.buttonLay {
		margin-top: 62upx;
		// margin-bottom: 190upx;

		.butStyle {
			font-family: PingFangSC, PingFang SC;
			width: 622rpx;
			height: 86rpx;
			border-radius: 44rpx;
			text-align: center;
			line-height: 86rpx;
			font-weight: 500;
			font-size: 34upx;
			color: #FFFFFF;

		}

		.butAction {
			font-size: 27upx;
			color: #FFFFFF;
			background: #FF9BA7;
			margin-bottom: 10upx;
		}

	}

	::v-deep .uni-file-picker {

		.icon-add {
			background-color: #D8D8D8;
			width: 55rpx;
			height: 8rpx;
		}

		.is-add {
			background-color: #EFEFEF;
		}
	}

</style>
<style>
</style>